import React, { useState } from 'react';
import { Container, Alert } from 'react-bootstrap';
import AuthForm from './components/AuthForm';
import ChatWindow from './components/ChatWindow';

export default function App() {
  const [isLoggedIn, setIsLoggedIn] = useState(false);
  const [error, setError] = useState(null);

  return (
    <Container fluid className="app-container">
      <h1 className="text-center mb-4">ByIM 即时通讯</h1>
      
      {error && <Alert variant="danger" onClose={() => setError(null)} dismissible>
        {error}
      </Alert>}

      {!isLoggedIn ? (
        <AuthForm 
          onLogin={() => setIsLoggedIn(true)}
          onError={setError}
        />
      ) : (
        <ChatWindow />
      )}
    </Container>
  );
}
